<template>
    <div class="app-container">
        <el-row :gutter="20">
            <!--部门数据-->
            <el-col :span="4" :xs="24">

                <fileTrees @handleNodeClick="onTreeClick" :tableHeight="treeHeight" :isnoClick="isnoClick" :menuId="menuId">
                </fileTrees>
            </el-col>
            <!--离线接收数据-->
            <el-col :span="20" :xs="24" v-show="isShow">
                <queryCriteriaList v-if="listFrom.length > 0" :showSearch="showSearch" :listFrom="listFrom"
                    @resetQuery="resetQuery" @handleQuery="handleQuery" ref="queryForm"></queryCriteriaList>
                <el-row :gutter="10" class="mb8" ref="refbut" v-show="!((subStr == 'F' && categoryType == '3') || (subStr == 'F' && categoryType == '1'))">
                    <el-col :span="1.5">
                        <el-button type="primary" plain icon="el-icon-takeaway-box" v-hasPermi="['archive:czjd:fp']"
                            @click="onClickTap('yijiao')">移交</el-button>
                    </el-col>

                    <el-col :span="1.5">
                        <el-button type="primary" plain icon="el-icon-plus" v-hasPermi="['archive:czjd:fp']"
                            @click="onClickTap('bgqx')">续存</el-button>
                    </el-col>

                    <el-col :span="1.5">
                        <el-button type="primary" plain icon="el-icon-minus" v-hasPermi="['archive:czjd:fp']"
                            @click="onClickTap('xiaohui')">销毁</el-button>
                    </el-col>
                    <right-toolbar :showSearch.sync="showSearch" @queryTable="getlistPost"></right-toolbar>
                </el-row>
                <tableList v-if="tableHeight" :tableHeaderList="tableHeaderList" :isCZJD="true"
                    @handleSelectionChange="handleSelectionChange" :tableData="tableData" :loading="loading"
                    :tableHeight="tableHeight" @celldblclick="celldblclick" @sortChange="sortChange" ref="ref"></tableList>
                <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
                    :limit.sync="queryParams.pageSize" @pagination="getlistPost" />
            </el-col>

            <el-col :span="20" :xs="24" v-show="!isShow" class="empty">
                <el-empty :image-size="200"></el-empty>
            </el-col>

        </el-row>


        <!--start  组件详情 -->
        <jianDetailsOpen v-if="jianDetailsOpen" :open="jianDetailsOpen" :celldbData="celldbData"
            @detailsHandleClose="detailsHandleClose">
        </jianDetailsOpen>
        <!--end 组件详情 -->
        <!-- start 组卷\项目详情 -->
        <juanDetailsOpen v-if="juanDetailsOpen" :open="juanDetailsOpen" :celldbData="celldbData"
            @detailsHandleClose="detailsHandleClose"></juanDetailsOpen>
        <!-- end 组卷\项目详情 -->
    </div>
</template>
<script>
import { getthbytreenodeHeaderList, getqueryfieldList } from "@/api/archive/fileCollection/offlinReception.js";
import { getGroupTree } from "@/api/archive/archivesCategory.js"
import { list, fpcz } from '@/api/archive/archivalAppraisal/destruction/destructionJD.js'
import fileTrees from "@/components/fileTrees/index.vue"  //档案树
import treeHeight from '@/mixins/treeHeight'//计算左侧树的高度
import { getLastIndexOf } from "@/utils/index.js"
import tableList from "@/components/tableList/index.vue"
import jianDetailsOpen from '@/components/componentsJianDetails/index.vue' //件详情
import juanDetailsOpen from '@/components/componentsJuanDetails/index.vue' //卷详情
import queryCriteriaList from "@/components/queryCriteriaList/index.vue"  //查询列表
export default {
    mixins: [treeHeight], // 混入方法
    components: {
        fileTrees,
        tableList,
        jianDetailsOpen,
        juanDetailsOpen,
        queryCriteriaList
    },
    data() {
        return {
            loading: false,
            isnoClick: true, //防止树重复点击
            menuId: '',
            isShow: false, //是否显示右侧数据 isShow:true,  //判断  著录项目内件按钮是否显示
            // 显示搜索条件
            showSearch: true,
            // 查询参数
            queryParams: {
                pageNum: 1,
                pageSize: 10,
            },
            total: 0,
            tableHeaderList: [], //table表头数据
            tableData: [],//table列表数据
            listFrom: [],//查詢列表字段
            jianDetailsOpen: false,//件详情弹窗
            juanDetailsOpen: false,//卷详情弹窗
            openInfo: { //件 卷  项目
                opens: false,
                categoryId: undefined,
                menuId: undefined,
                type: undefined
            },
            tableHeight: "",
            // 选中数组
            ids: [],
            // 非单个禁用
            single: true,
            // 非多个禁用
            multiple: true,
            subStr: '',
            categoryType: '',
        }
    },
    created() {
        this.menuId = this.$route.meta.menuId
    },
    methods: {
        //动态设置table的高度
        tableHeightData() {
            this.$nextTick(
                () => {
                    let h = document.documentElement.clientHeight
                    //     console.log(this.$refs.queryForm.$el.offsetHeight, this.$refs.refbut.$el.offsetHeight, "sdklfjklliuhaiorng")
                    h = h - 200
                    if (this.$refs.queryForm) { // 页面上如果有面包屑区域徐减去它的高度
                        h = h - this.$refs.queryForm.$el.offsetHeight
                    }

                    if (this.$refs.refbut) { // 页面上如果有分页区域徐减去它的高度
                        h = h - this.$refs.refbut.$el.offsetHeight
                    }
                    // console.log(h,"sdjfdklsjfkl")
                    this.tableHeight = h > 310 ? h : 310 // 根据自己项目定高度

                    return h
                }
            )

        },
        // 树节点单击事件
        onTreeClick(data) {
            var that = this;
            this.isnoClick = false;
            this.treeRowData = data;
            if (data.categoryId != null) {
                this.isShow = true
            } else {
                this.isShow = false
            }
            if (this.$refs.queryForm != undefined) {
                this.$refs.queryForm.queryParams = {};
            }
            if (data.nodeType == null || data.nodeType == "t" || data.nodeType == "f") {
                this.isnoClick = true;
                return false;

            }
            this.loading = true;
            // this.queryParams = data;
            // console.log(data, "+++++++++++++++++")
            this.queryParams.order = '';
            this.queryParams.pageNum = 1;
            this.queryParams.pageSize = 10;
            this.queryParams.categoryId = data.categoryId;
            this.queryParams.menuId = data.menuId;
            this.queryParams.propertyName = data.propertyName;
            this.queryParams.propertyValue = data.propertyValue;
            this.queryParams.subTableName = data.sub_table_name;
            if (this.queryParams.subTableName != undefined) {
                this.subStr = getLastIndexOf(this.queryParams.subTableName);
                let stb = this.queryParams.subTableName;
                let stbArr = stb.split("_");
                this.categoryType = stbArr[stbArr.length - 3];
                that.$nextTick(res => {
                    this.getqueryfieldListPost();//点击树节点获取查询字段
                    this.getlistHeaderPost();/**点击树节点,获取table表头数据 */
                })
            } else {
                this.getGroupTreePost(data.categoryId);
            }




        },
        //档案门类树门类根据categoryID回显
        getGroupTreePost(ID) {
            getGroupTree(ID).then(response => {
                console.log(response)
                if (response.data.type == "0") { //件
                    this.queryParams.subTableName = response.data.fileTableName;
                } else if (response.data.type == "1") { //卷
                    this.queryParams.subTableName = response.data.folderTableName;
                } else if (response.data.type == "3") { //项目
                    this.queryParams.subTableName = response.data.folderTableName;
                }
                this.subStr = getLastIndexOf(this.queryParams.subTableName);
                let stb = this.queryParams.subTableName;
                let stbArr = stb.split("_");
                this.categoryType = stbArr[stbArr.length - 3];
                this.getqueryfieldListPost();//点击树节点获取查询字段
                this.getlistHeaderPost();/**点击树节点,获取table表头数据 */
            });
        },



        /** 点击树节点获取查询字段 */
        getqueryfieldListPost() {
            this.queryParams.searchcolumn = undefined
            getqueryfieldList({
                categoryId: this.queryParams.categoryId,
                menuId: this.queryParams.menuId,
                subTableName: this.queryParams.subTableName,
            }).then(response => {
                this.listFrom = response.rows;
            });
        },

        /**点击树节点,获取table表头数据 */
        getlistHeaderPost() {
            getthbytreenodeHeaderList({
                categoryId: this.queryParams.categoryId,
                menuId: this.queryParams.menuId,
                subTableName: this.queryParams.subTableName
            }
            ).then(response => {
                this.tableHeaderList = response.rows;
                var fields = []
                for (var i in response.rows) {
                    fields.push(response.rows[i].FIELD_NAME)
                }
                this.queryParams.fields = fields.toString()
                this.getlistPost();
            });
        },
        /** 点击树节点,获取table数据*/
        getlistPost() {
            var that = this;
            this.loading = true;
            list(this.queryParams).then(response => {
                this.tableData = response.rows;
                this.total = response.total;
                this.loading = false;
                this.isnoClick = true;
                this.tableHeightData();
            });
        },
        //是否选择数据
        handleSelectionChange(ids, single, multiple, selection) {
            this.ids = ids.toString();
            this.single = single;
            this.multiple = multiple;
            this.isValue = selection.every(item => item.CZTYPE === null);
        },

        //双击列表进入详情页面
        celldblclick(row) {
            var level = "";
            var label = "";
            console.log(this.queryParams.subTableName,"_____________")
            if (getLastIndexOf(this.queryParams.subTableName) == "F") {  //F 件
                level = 0
                label = row.TITLE;
            } else if (getLastIndexOf(this.queryParams.subTableName) == "V") { //卷
                level = 1
                label = row.TITLE;
            } else { //项目
                level = 3
                label = row.TITLE;
            }

            this.celldbData = {
                id: row.ID,
                categoryId: this.queryParams.categoryId,
                menuId: this.queryParams.menuId,
                sub_table_name: this.queryParams.subTableName,
                label: label,
                level: level,
                ifSub_table_name: this.queryParams.subTableName,
                isDel: "0",  //判断是回收站数据还是接收收据 isDel:1  回收站    isDel:0 //离线接收、档案接收、在线接收
                tableHeaderList: this.tableHeaderList
            }
            this.$nextTick(() => {
                if (this.subStr == "F") {  //F 进入件详情
                    this.jianDetailsOpen = true;
                } else { //进入卷详情 和项目详情
                    this.juanDetailsOpen = true
                }
            })

        },
          //关闭详情页面
          detailsHandleClose() {
            this.jianDetailsOpen = false;
            this.juanDetailsOpen = false;

        },

        //排序
        sortChange(val) {
            this.queryParams.order = val;
            this.getlistPost();
        },

        //点击搜索
        handleQuery(searchcolumn) {
            var column = searchcolumn.filter(item => { return item.value !== '' && item.value !== null })
            this.queryParams.searchcolumn = column
            this.queryParams.order = undefined;
            this.getlistPost();
            this.$refs.ref.clearSort()
        },
        //表单重置
        resetQuery() {
            this.queryParams.searchcolumn = undefined
            this.queryParams.order = undefined;
            this.getlistPost();
            this.$refs.ref.clearSort()
        },

        //移交\缓存\销毁
        onClickTap(type) {
            if (!this.multiple) {
              if (this.isValue) {
                var text = ''
                // console.log(type,"====")
                if (type == 'xiaohui') {
                  text = "销毁"
                } else if (type == 'yijiao') {
                  text = "添加移交单"
                } else if (type == 'bgqx') {
                  text = "添加续存"
                }
                this.$modal.confirm('是否确认' + text + '？').then(() => {
                  console.log(type, "++++")
                  fpcz({
                    categoryId: this.queryParams.categoryId,
                    ids: this.ids.split(","),
                    type: type
                  }).then(res => {
                    if (res.code == "200") {
                      this.$modal.msgSuccess(res.msg);
                    }
                    this.getlistPost();
                  })

                }).catch(() => { });
              } else {
                this.$modal.msgWarning('所选档案已处于鉴定中')
              }
            } else {
                this.$message({ message: '请选择要添加的数据哦', type: 'warning' })
            }
        },



    }
}
</script>
